<template>
    <div class="container">
        <div class="tabCommonTitle">
            <span>知识产权及其他附件</span>
        </div>
        <p class="list_title">
            <span class="list_name">知识产权证明</span>
            <a-button class="shangchuan pointer" :class="is_modify=='Y'?'':'disabled'" @click="upload_zscq" :disabled="is_modify=='Y'?false:true">添加</a-button>
        </p>
        <div class="tableList">
            <table style="text-align:center;" width="1110"  align="center" cellpadding="">
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>授权（申请）成果名称</th>
                        <th>上传状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody v-if="zscqlist.length">
                    <tr v-for="(item, index) in zscqlist" :key="index">
                        <td>{{index+1}}</td>
                        <td>{{item.zscqMc}}</td>
                        <td>{{item.filePath!='' ?'成功':''}}</td>
                        <td>
                            <!-- <a>
                                <a-icon type="eye" @click="preview_zscq(item.filePath)"/>
                                <a-icon type="edit" @click="edit_zscq(item.id)"/>
                                <a-icon type="delete" @click="del_zscq(item.id)"/>
                            </a> -->
                            <a>
                                <img style="width:18px;height:18px;margin-right:22px;" @click="preview_zscq(item.filePath)" src="@/assets/img/yulan.png" alt="">
                                <img v-if="is_modify=='Y'?true:false" style="width:18px;height:18px;margin-right:11px;" @click="edit_zscq(item.id)" src="@/assets/img/bianji.png" alt="">
                                <img v-if="is_modify=='Y'?true:false" style="width:18px;height:18px;margin-left:11px;" @click="del_zscq(item.id)" src="@/assets/img/shanchu1.png" alt="">
                            </a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="list_title">
            <span class="list_name">实施应用证明</span>
            <p>
                <a-button class="templateDownload" style="margin-right:20px;" @click="downloadSsyymb">模板下载</a-button>
                <a-button class="shangchuan pointer" :class="is_modify=='Y'?'':'disabled'" @click="upload_ssyy" :disabled="is_modify=='Y'?false:true">添加</a-button>
            </p>
        </div>
        <div class="tableList">
            <table style="text-align:center;" width="1110"  align="center" cellpadding="">
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>实施应用单位名称</th>
                        <th>上传状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody v-if="ssyylist.length">
                    <tr v-for="(item, index) in ssyylist" :key="index">
                        <td>{{index+1}}</td>
                        <td>{{item.ssyyDwmc}}</td>
                        <td>{{item.filePath!='' ?'成功':''}}</td>
                        <td>
                            <a>
                                <img style="width:18px;height:18px;margin-right:22px;" @click="preview_ssyy(item.filePath)" src="@/assets/img/yulan.png" alt="">
                                <img v-if="is_modify=='Y'?true:false" style="width:18px;height:18px;margin-right:11px;"  @click="edit_ssyy(item.id)" src="@/assets/img/bianji.png" alt="">
                                <img v-if="is_modify=='Y'?true:false" style="width:18px;height:18px;margin-left:11px;" @click="del_ssyy(item.id)" src="@/assets/img/shanchu1.png" alt="">
                            </a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <p class="list_title">
            <span class="list_name">其他证明</span>
            <a-button class="shangchuan pointer" :class="is_modify=='Y'?'':'disabled'" @click="upload_qtfj" :disabled="is_modify=='Y'?false:true">添加</a-button>
        </p>
        <div class="tableList">
            <table style="text-align:center;" width="1110"  align="center" cellpadding="">
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>附件名称</th>
                        <th>上传状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody v-if="qtfjlist.length">
                    <tr v-for="(item, index) in qtfjlist" :key="index">
                        <td>{{index+1}}</td>
                        <td>{{item.fjWjMc}}</td>
                        <td>{{item.filePath!='' ?'成功':''}}</td>
                        <td>
                            <!-- <a>
                                <a-icon type="eye" @click="preview_qtfj(item.filePath)"/>
                                <a-icon type="edit" @click="edit_qtfj(item.id)"/>
                                <a-icon type="delete" @click="del_qtfj(item.id)"/>
                            </a> -->
                            <a>
                                <img style="width:18px;height:18px;margin-right:22px;" @click="preview_qtfj(item.filePath)" src="@/assets/img/yulan.png" alt="">
                                <img v-if="is_modify=='Y'?true:false" style="width:18px;height:18px;margin-right:11px;"  @click="edit_qtfj(item.id)" src="@/assets/img/bianji.png" alt="">
                                <img v-if="is_modify=='Y'?true:false" style="width:18px;height:18px;margin-left:11px;" @click="del_qtfj(item.id)" src="@/assets/img/shanchu1.png" alt="">
                            </a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <a-modal
            v-drag-modal
			:title="modal_title"
            class="enclosure_modal"
			:visible="visible"
            :maskClosable="false"
            :width="700"
            @cancel="handleCancel"
		>
            <template slot="footer">
                <a-button @click="handleCancel">取消</a-button>
                <a-button key="submit" type="primary" :disabled="disabled_add" @click="handleSubmit">保存</a-button>
            </template>
			<a-form-model ref="ruleForm" v-if="upload_type=='0'" :model="form_add" :rules="rules_add" >
				<a-form-model-item ref="fujianname" prop="fujianname" label="授权（申请）成果名称" :label-col="{ span:12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianname" placeholder="授权（申请）成果名称"  @blur="() => {$refs.fujianname.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianleibie" prop="fujianleibie" label="知识产权类别" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-select class="selectList" v-model="form_add.fujianleibie" placeholder="知识产权类别">
                        <a-select-option v-for="(item, index) in leibiearr" :value="item.value" :key="index">{{item.value}}</a-select-option>
                    </a-select>
                    <!-- <a-input v-model="form_add.fujianleibie" placeholder="知识产权类别"  @blur="() => {$refs.fujianleibie.onFieldBlur();}"/> -->
				</a-form-model-item>
                <a-form-model-item ref="fujianguobie" prop="fujianguobie" label="国（区）别" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianguobie" placeholder="国（区）别"  @blur="() => {$refs.fujianguobie.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianshenqing" prop="fujianshenqing" label="申请号" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianshenqing" placeholder="申请号"  @blur="() => {$refs.fujianshenqing.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianshouquan" prop="fujianshouquan" label="授权号" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianshouquan" placeholder="授权号"  @blur="() => {$refs.fujianshouquan.onFieldBlur();}"/>
				</a-form-model-item>
				<a-form-model-item ref="fujianfile" prop="fujianfile" label="上传文件（50M以内，pdf格式）：" :label-col="{ span:12 }" :wrapper-col="{ span: 8}">
                    <a-upload
                        action="#"
                        accept='.pdf'
                        :file-list="fileList"
                        :show-upload-list="showUploadList"
                        :before-upload="beforeUpload"
                    >
                        <a-button style="width: 120px;height: 40px;line-height: 40px;margin:0;background:#fff;color:#333;"><a-icon type="upload" />上传</a-button>
                    </a-upload>
                </a-form-model-item>
			</a-form-model>
            <a-form-model ref="ruleForm" v-else-if="upload_type=='1'" :model="form_add" :rules="rules_add" >
				<a-form-model-item ref="fujiandanwei" prop="fujiandanwei" label="实施应用单位名称" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujiandanwei" placeholder="实施应用单位名称"  @blur="() => {$refs.fujiandanwei.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujiantime" prop="fujiantime" label="应用起始时间" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-date-picker
                        v-model="form_add.fujiantime"
                        placeholder="应用起始时间"
                        style="width: 100%;"
                        @change="startChange"
                    />
                    <!-- <a-input v-model="form_add.fujiantime" placeholder="应用起始时间"  @blur="() => {$refs.fujiantime.onFieldBlur();}"/> -->
				</a-form-model-item>
                <a-form-model-item ref="fujianlianxiren" prop="fujianlianxiren" label="应用单位联系人" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianlianxiren" placeholder="应用单位联系人"  @blur="() => {$refs.fujianlianxiren.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujiandianhua" prop="fujiandianhua" label="座机" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujiandianhua" placeholder="座机"  @blur="() => {$refs.fujiandianhua.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianxiaoyi" prop="fujianxiaoyi" label="产生的经济效益（万元）" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianxiaoyi" placeholder="产生的经济效益（万元）" type="number"  @blur="() => {$refs.fujianxiaoyi.onFieldBlur();}"/>
				</a-form-model-item>
				<a-form-model-item ref="fujianfile" prop="fujianfile" label="上传文件（50M以内，pdf格式）：" :label-col="{ span:12 }" :wrapper-col="{ span: 8}">
                    <a-upload
                        action="#"
                        accept='.pdf'
                        :file-list="fileList"
                        :show-upload-list="showUploadList"
                        :before-upload="beforeUpload"
                    >
                        <a-button style="width: 120px;height: 40px;line-height: 40px;margin:0;background:#fff;color:#333;"><a-icon type="upload" />上传</a-button>
                    </a-upload>
                </a-form-model-item>
			</a-form-model>
            <a-form-model ref="ruleForm" v-else :model="form_add" :rules="rules_add" >
				<a-form-model-item ref="fujianname" prop="fujianname" label="附件名称" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
					<a-input v-model="form_add.fujianname" placeholder="附件名称"  @blur="() => {$refs.fujianname.onFieldBlur();}"/>
				</a-form-model-item>
				<a-form-model-item ref="fujianfile" prop="fujianfile" label="上传文件（50M以内，pdf格式）：" :label-col="{ span:12 }" :wrapper-col="{ span: 8}">
                    <a-upload
                        action="#"
                        accept='.pdf'
                        :file-list="fileList"
                        :show-upload-list="showUploadList"
                        :before-upload="beforeUpload"
                    >
                        <a-button style="width: 120px;height: 40px;line-height: 40px;margin:0;background:#fff;color:#333;"><a-icon type="upload" />上传</a-button>
                    </a-upload>
                </a-form-model-item>
			</a-form-model>
		</a-modal>
        <a-modal
            v-drag-modal
			:title="modal_title"
            class="enclosure_modal"
			:visible="visible_edit"
            :maskClosable="false"
            :width="700"
            @cancel="handleCancel_edit"
		>
            <template slot="footer">
                <a-button @click="handleCancel_edit">取消</a-button>
                <a-button key="submit" type="primary" :disabled="disabled_edit" @click="handleSubmit_edit">保存</a-button>
            </template>
            <a-form-model ref="ruleForm_edit" v-if="upload_type=='0'" :model="form_add" :rules="rules_edit" >
				<a-form-model-item ref="fujianname" prop="fujianname" label="授权（申请）成果名称" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianname" placeholder="授权（申请）成果名称"  @blur="() => {$refs.fujianname.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianleibie" prop="fujianleibie" label="知识产权类别" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
                    <a-select class="selectList" v-model="form_add.fujianleibie" placeholder="知识产权类别">
                        <a-select-option v-for="(item, index) in leibiearr" :value="item.value" :key="index" @blur="() => {$refs.fujianleibie.onFieldBlur();}">{{item.value}}</a-select-option>
                    </a-select>
					<!-- <a-input v-model="form_add.fujianleibie" placeholder="知识产权类别"  @blur="() => {$refs.fujianleibie.onFieldBlur();}"/> -->
				</a-form-model-item>
                <a-form-model-item ref="fujianguobie" prop="fujianguobie" label="国（区）别" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianguobie" placeholder="国（区）别"  @blur="() => {$refs.fujianguobie.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianshenqing" prop="fujianshenqing" label="申请号" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianshenqing" placeholder="申请号"  @blur="() => {$refs.fujianshenqing.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianshouquan" prop="fujianshouquan" label="授权号" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianshouquan" placeholder="授权号"  @blur="() => {$refs.fujianshouquan.onFieldBlur();}"/>
				</a-form-model-item>
				<a-form-model-item ref="fujianfile" prop="fujianfile" label="上传文件（50M以内，pdf格式）：" :label-col="{ span:12 }" :wrapper-col="{ span: 8}">
                    <a-upload
                        action="#"
                        accept='.pdf'
                        :file-list="fileList"
                        :show-upload-list="showUploadList"
                        :before-upload="beforeUpload"
                    >
                        <a-button style="width: 120px;height: 40px;line-height: 40px;margin:0;background:#fff;color:#333;"><a-icon type="upload" />上传</a-button>
                    </a-upload>
                </a-form-model-item>
                <!-- <a-form-model-item ref="fujianname_edit" prop="fujianname_edit" label="附件名称" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
					<a-input v-model="form_add.fujianname_edit" placeholder="附件名称"  @blur="() => {$refs.fujianname_edit.onFieldBlur();}"/>
				</a-form-model-item> -->
				<!-- <a-form-model-item ref="fujianfile_edit" prop="fujianfile_edit" label="上传文件（50M以内，pdf格式）：" :label-col="{ span:12 }" :wrapper-col="{ span: 8 }">
                    <a-upload
                        action="#"
                        accept='.pdf'
                        :file-list="fileList"
                        :show-upload-list="showUploadList"
                        :before-upload="beforeUpload"
                    >
                        <a-button style="width: 120px;height: 40px;line-height: 40px;margin:0;background:#fff;color:#333;"><a-icon type="upload" />重新上传</a-button>
                    </a-upload>
            	</a-form-model-item> -->
                <a-form-model-item label="已上传文件： " :label-col="{ span:5 }" :wrapper-col="{ span: 17 }">
					<a-input v-model="form_add.fujianrename" disabled />
				</a-form-model-item>
			</a-form-model>
            <a-form-model ref="ruleForm_edit" v-else-if="upload_type=='1'" :model="form_add" :rules="rules_edit" >
				<a-form-model-item ref="fujiandanwei" prop="fujiandanwei" label="实施应用单位名称" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujiandanwei" placeholder="实施应用单位名称"  @blur="() => {$refs.fujiandanwei.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujiantime" prop="fujiantime" label="应用起始时间" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-date-picker
                        v-model="form_add.fujiantime"
                        placeholder="应用起始时间"
                        style="width: 100%;"
                        @change="startChange"
                    />
				</a-form-model-item>
                <a-form-model-item ref="fujianlianxiren" prop="fujianlianxiren" label="应用单位联系人" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianlianxiren" placeholder="应用单位联系人"  @blur="() => {$refs.fujianlianxiren.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujiandianhua" prop="fujiandianhua" label="座机" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujiandianhua" placeholder="座机"  @blur="() => {$refs.fujiandianhua.onFieldBlur();}"/>
				</a-form-model-item>
                <a-form-model-item ref="fujianxiaoyi" prop="fujianxiaoyi" label="产生的经济效益（万元）" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
					<a-input v-model="form_add.fujianxiaoyi" placeholder="产生的经济效益（万元）" type="number" @blur="() => {$refs.fujianxiaoyi.onFieldBlur();}"/>
				</a-form-model-item>
				<a-form-model-item ref="fujianfile" prop="fujianfile" label="上传文件（50M以内，pdf格式）：" :label-col="{ span:12 }" :wrapper-col="{ span: 8}">
                    <a-upload
                        action="#"
                        accept='.pdf'
                        :file-list="fileList"
                        :show-upload-list="showUploadList"
                        :before-upload="beforeUpload"
                    >
                        <a-button style="width: 120px;height: 40px;line-height: 40px;margin:0;background:#fff;color:#333;"><a-icon type="upload" />上传</a-button>
                    </a-upload>
                </a-form-model-item>
                <a-form-model-item label="已上传文件： " :label-col="{ span:5 }" :wrapper-col="{ span: 17 }">
					<a-input v-model="form_add.fujianrename" disabled />
				</a-form-model-item>
			</a-form-model>
			<a-form-model ref="ruleForm_edit" v-else :model="form_add" :rules="rules_edit" >
				<a-form-model-item ref="fujianname" prop="fujianname" label="附件名称" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
					<a-input v-model="form_add.fujianname" placeholder="附件名称"  @blur="() => {$refs.fujianname.onFieldBlur();}"/>
				</a-form-model-item>
				<a-form-model-item ref="fujianfile" prop="fujianfile" label="上传文件（50M以内，pdf格式）：" :label-col="{ span:12 }" :wrapper-col="{ span: 8 }">
                    <a-upload
                        action="#"
                        accept='.pdf'
                        :file-list="fileList"
                        :show-upload-list="showUploadList"
                        :before-upload="beforeUpload"
                    >
                        <a-button style="width: 120px;height: 40px;line-height: 40px;margin:0;background:#fff;color:#333;"><a-icon type="upload" />重新上传</a-button>
                    </a-upload>
            	</a-form-model-item>
                <a-form-model-item label="已上传文件： " :label-col="{ span:5 }" :wrapper-col="{ span: 17 }">
					<a-input v-model="form_add.fujianrename" disabled />
				</a-form-model-item>
			</a-form-model>
		</a-modal>
        <!-- <div class="showpdf" v-if="showpdf">
            <img class="closebtn pointer" @click="closepdf" src="@/assets/img/close1.png"/>
            <testPdf :cxj_cxj_id="cxj_cxj_id" :file-path="filePath"></testPdf>
        </div> -->
        <testPdf :cxj_cxj_id="cxj_cxj_id" :file-path="filePath" :showPdf="showpdf"></testPdf>
    </div>
</template>

<script>
import {
    cxjsb_getZscq,
    cxjsb_zscqAdd,
    cxjsb_zscqList,
    cxjsb_zscqDelete,
    cxjsb_getSsyy,
    cxjsb_ssyyAdd_fj,
    cxjsb_ssyyList,
    cxjsb_ssyyDelete,
    cxjsb_getQtfj,
    cxjsb_qtfjAdd,
    cxjsb_qtfjList,
    cxjsb_qtfjDelete,
    cxjsb_downloadSsyymb
} from '@/api/shenbao';
import testPdf from '@/views/declarationSystem/declare/testPdf';
export default {
    name: 'Enclosure',
    props: ['is_modify'],
    components: {
        testPdf
    },
    data() {
        return {
            modal_title: '',
            visible: false,
            visible_edit: false,
            confirmLoading: false,
            // form: this.$form.createForm(this, { name: 'coordinated' }),
            cxj_cxj_id: '',
            form: {

            },
            rules: {

            },
            // form_add: {

            // },
            rules_add: {

            },
            // form_add: {
            //     fujianname: '',
            //     fujiandanwei: '',
            //     fujiantime: null,
            //     fujianfile: ''
            // },
            // rules_add: {
            //     fujianname: [
            //         { required: true, message: '请填写附件名称',trigger: 'blur' }
            //     ],
            //     fujianfile: [{ required: true, message: '请上传文件',trigger: 'change' }],
            // },
            form_add: {
                // fujianname_edit: '',
                // fujiandanwei_edit: '',
                // fujiantime_edit: null,
                // fujianfile_edit: '',
                // fujianrename_edit: '',
            },
            rules_edit: {
                // fujianname_edit: [
                //     { required: true, message: '请填写附件名称',trigger: 'blur' }
                // ],
                // fujianfile_edit: [],
            },
            files: '',
            upload_type: '',
            zscqlist: [],
            ssyylist: [],
            qtfjlist: [],
            fileList: [],
            showUploadList: {
                showDownloadIcon: false,
                showRemoveIcon: false,
            },
            disabled_add: false,
            disabled_edit: false,
            leibiearr: [{
                value: "发明专利"
            },{
                value: "实用新型专利"
            },{
                value: "软件著作权"
            }],
            showpdf: false,
            filePath: '',
        }
    },
    props: ['is_modify'],
    methods: {
        handleCancel() {
            this.visible = false;
            this.disabled_add = false;
            this.files = '';
            this.resetForm();
        },
        handleCancel_edit() {
            this.visible_edit = false;
            this.disabled_edit = false;
            this.files = '';
            this.resetForm_edit();
        },
        upload_zscq() {
            this.modal_title = '知识产权证明';
            this.edit_id = '';
            this.upload_type = 0;
            this.form_add = {
                fujianname: '',
                fujianleibie: '',
                fujianguobie: '',
                fujianshenqing: '',
                fujianshouquan: '',
                fujianfile: ''
            };
            this.rules_add = {
                fujianname: [
                    { required: true, message: '请填写附件名称',trigger: 'blur' }
                ],
                fujianleibie: [
                    { required: true, message: '请填写附件类别',trigger: 'blur' }
                ],
                fujianguobie: [
                    { required: true, message: '请填写附件国别',trigger: 'blur' }
                ],
                fujianshenqing: [
                    { required: true, message: '请填写附件申请号',trigger: 'blur' }
                ],
                fujianshouquan: [
                    // { required: true, message: '请填写附件授权号',trigger: 'blur' }
                ],
                fujianfile: [{ required: true, message: '请上传文件',trigger: 'change' }],
            };
            this.visible = true;
            this.files = '';
        },
        // closepdf() {
        //     this.filePath = '';
        //     this.showpdf = false;
        // },
        preview_zscq(filePath) {
            // this.showpdf = true;
            this.showpdf = !this.showpdf;
            this.filePath = filePath;
            // let that = this;
            // let routeData = this.$router.resolve({
            //     path: '/shenbao/pdfFile',
            //     query: {
            //         cxj_cxj_id: that.cxj_cxj_id,
            //         path: filePath
            //     }
            // });
            // window.open(routeData.href, '_blank');
        },
        edit_zscq(id) {
            this.modal_title = '知识产权证明';
            this.edit_id = id;
            this.upload_type = 0;
            this.visible_edit = true;
            // form_add: {
            //     // fujianname_edit: '',
            //     // fujiandanwei_edit: '',
            //     // fujiantime_edit: null,
            //     // fujianfile_edit: '',
            //     // fujianrename_edit: '',
            // },
            // rules_edit: {
            //     // fujianname_edit: [
            //     //     { required: true, message: '请填写附件名称',trigger: 'blur' }
            //     // ],
            //     // fujianfile_edit: [],
            // },
            this.form_add = {
                fujianname: '',
                fujianleibie: '',
                fujianguobie: '',
                fujianshenqing: '',
                fujianshouquan: '',
                fujianfile: '',
                fujianrename: '',
            };
            this.rules_edit = {
                fujianname: [
                    { required: true, message: '请填写附件名称',trigger: 'blur' }
                ],
                fujianleibie: [
                    { required: true, message: '请填写附件类别',trigger: 'blur' }
                ],
                fujianguobie: [
                    { required: true, message: '请填写附件国别',trigger: 'blur' }
                ],
                fujianshenqing: [
                    { required: true, message: '请填写附件申请号',trigger: 'blur' }
                ],
                fujianshouquan: [
                    // { required: true, message: '请填写附件授权号',trigger: 'blur' }
                ],
                fujianfile: [],
            };
            this.files = '';
            let that = this;
            cxjsb_getZscq({cxj_cxj_id:that.cxj_cxj_id,id}).then(res=>{
                if (res.data.code=='200') {
                    let data = res.data.result;
                    this.form_add.fujianname = data.zscqMc;
                    this.form_add.fujianleibie = data.zscqLb;
                    this.form_add.fujianguobie = data.zscqGb;
                    this.form_add.fujianshenqing = data.zscqSqh;
                    this.form_add.fujianshouquan = data.zscqSqha;
                    this.form_add.fujianrename = data.fileRename;
                    // this.form.fujiandanwei = data.jdzsDwmc;
                    // this.form.fujiantime = data.jdzsSj;
                    // this.form.fujianfile = that.getObjectURL(data.filePath);
                }
            })
        },
        del_zscq(id) {
            let that = this;
            this.$confirm({
                content: '确定要删除该项吗？',
                onOk() {
                    cxjsb_zscqDelete({
                        cxj_cxj_id: that.cxj_cxj_id,
                        id: id
                    }).then(res=>{
                        let data = res.data;
                        if (data.success) {
                            that.$message.success('删除成功');
                            that.get_cxjsb_zscqList();
                        } else {
                            that.$message.error(data.message);
                        }
                    })
                },
                cancelText: '取消',
                onCancel() {
                    that.destroyAll();
                },
            });
        },
        downloadSsyymb() {
            let that = this;
            cxjsb_downloadSsyymb({cxj_cxj_id: that.cxj_cxj_id}).then(res=>{
                const data = res.data;
                const url = window.URL.createObjectURL(new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"}))
                const link = document.createElement('a')
                link.style.display = 'none'
                link.href = url;
                link.setAttribute('download', '实施应用证明.doc')
                document.body.appendChild(link)
                link.click()
                document.body.removeChild(link)
                // if (res.data.code=='200') {
                //     that.$message.success('下载成功');
                // } else {
                //     that.$message.error(res.data.message);
                // }
            })
        },
        upload_ssyy() {
            this.modal_title = '实施应用证明';
            this.edit_id = '';
            this.upload_type = 1;
            this.form_add = {
                fujiandanwei: '',
                fujiantime: '',
                fujianlianxiren: '',
                fujiandianhua: '',
                fujianxiaoyi: '',
                fujianfile: ''
            };
            this.rules_add = {
                fujiandanwei: [
                    { required: true, message: '请填写实施应用单位名称',trigger: 'blur' }
                ],
                fujiantime: [
                    { required: true, message: '请填写应用起始时间',trigger: 'change' }
                ],
                fujianlianxiren: [
                    { required: true, message: '请填写应用单位联系人',trigger: 'blur' }
                ],
                fujianxiaoyi: [
                    { required: true, message: '请填写产生的经济效益',trigger: 'blur' }
                ],
                fujianfile: [{ required: true, message: '请上传文件',trigger: 'change' }],
            };
            this.visible = true;
            this.files = '';
        },
        startChange(date, dateString){
            console.log(date, dateString)
            this.form_add.fujiantime = dateString;
        },
        preview_ssyy(filePath) {
            // this.showpdf = true;
            this.showpdf = !this.showpdf;
            this.filePath = filePath;
            // let that = this;
            // let routeData = this.$router.resolve({
            //     path: '/shenbao/pdfFile',
            //     query: {
            //         cxj_cxj_id: that.cxj_cxj_id,
            //         path: filePath
            //     }
            // });
            // window.open(routeData.href, '_blank');
        },
        edit_ssyy(id) {
            this.modal_title = '实施应用证明';
            this.edit_id = id;
            this.upload_type = 1;
            this.form_add = {
                fujiandanwei: '',
                fujiantime: '',
                fujianlianxiren: '',
                fujiandianhua: '',
                fujianxiaoyi: '',
                fujianfile: '',
                fujianrename: '',
            };
            this.rules_edit = {
                fujiandanwei: [
                    { required: true, message: '请填写实施应用单位名称',trigger: 'blur' }
                ],
                fujiantime: [
                    { required: true, message: '请填写应用起始时间',trigger: 'change' }
                ],
                fujianlianxiren: [
                    { required: true, message: '请填写应用单位联系人',trigger: 'blur' }
                ],
                // fujiandianhua: [
                //     { required: true, message: '请填写正确的座机格式',trigger: 'blur',pattern:  /^[0][1-9]{2,3}-[0-9]{5,10}$/ }
                // ],
                fujianxiaoyi: [
                    { required: true, message: '请填写产生的经济效益',trigger: 'blur' }
                ],
                fujianfile: [],
            };
            this.visible_edit = true;
            this.files = '';
            let that = this;
            cxjsb_getSsyy({cxj_cxj_id:that.cxj_cxj_id,id}).then(res=>{
                if (res.data.code=='200') {
                    let data = res.data.result;
                    this.form_add.fujiandanwei = data.ssyyDwmc;
                    this.form_add.fujiantime = data.ssyyQssj;
                    this.form_add.fujianlianxiren = data.ssyyLxr;
                    this.form_add.fujiandianhua = data.ssyyDh;
                    this.form_add.fujianxiaoyi = data.ssyyJjxy;
                    this.form_add.fujianrename = data.fileRename;
                    // this.form.fujiandanwei = data.jdzsDwmc;
                    // this.form.fujiantime = data.jdzsSj;
                    // this.form.fujianfile = that.getObjectURL(data.filePath);
                }
            })
        },
        del_ssyy(id) {
            let that = this;
            this.$confirm({
                content: '确定要删除该项吗？',
                onOk() {
                    cxjsb_ssyyDelete({
                        cxj_cxj_id: that.cxj_cxj_id,
                        id: id
                    }).then(res=>{
                        let data = res.data;
                        if (data.success) {
                            that.$message.success('删除成功');
                            that.get_cxjsb_ssyyList();
                        } else {
                            that.$message.error(data.message);
                        }
                    })
                },
                cancelText: '取消',
                onCancel() {
                    that.destroyAll();
                },
            });
        },
        upload_qtfj() {
            this.modal_title = '其他证明';
            this.edit_id = '';
            this.upload_type = 2;
            this.form_add = {
                fujianname: '',
                fujianfile: ''
            };
            this.rules_add = {
                fujianname: [
                    { required: true, message: '请填写附件名称',trigger: 'blur' }
                ],
                fujianfile: [{ required: true, message: '请上传文件',trigger: 'change' }],
            },
            this.visible = true;
            this.files = '';
        },
        preview_qtfj(filePath) {
            // this.showpdf = true;
            this.showpdf = !this.showpdf;
            this.filePath = filePath;
            // let that = this;
            // let routeData = this.$router.resolve({
            //     path: '/shenbao/pdfFile',
            //     query: {
            //         cxj_cxj_id: that.cxj_cxj_id,
            //         path: filePath
            //     }
            // });
            // window.open(routeData.href, '_blank');
        },
        edit_qtfj(id) {
            this.modal_title = '其他证明';
            this.edit_id = id;
            this.upload_type = 2;
            this.visible_edit = true;
            this.form_add = {
                fujianname: '',
                fujianfile: '',
                fujianrename: '',
            };
            this.rules_add = {
                fujianname: [
                    { required: true, message: '请填写附件名称',trigger: 'blur' }
                ],
                fujianfile: [],
            },
            this.files = '';
            let that = this;
            cxjsb_getQtfj({cxj_cxj_id:that.cxj_cxj_id,id}).then(res=>{
                if (res.data.code=='200') {
                    let data = res.data.result;
                    this.form_add.fujianname = data.fjWjMc;
                    this.form_add.fujianrename = data.fileRename;
                    // this.form.fujiandanwei = data.jdzsDwmc;
                    // this.form.fujiantime = data.jdzsSj;
                    // this.form.fujianfile = that.getObjectURL(data.filePath);
                }
            })
        },
        del_qtfj(id) {
            let that = this;
            this.$confirm({
                content: '确定要删除该项吗？',
                onOk() {
                    cxjsb_qtfjDelete({
                        cxj_cxj_id: that.cxj_cxj_id,
                        id: id
                    }).then(res=>{
                        let data = res.data;
                        if (data.success) {
                            that.$message.success('删除成功');
                            that.get_cxjsb_qtfjList();
                        } else {
                            that.$message.error(data.message);
                        }
                    })
                },
                cancelText: '取消',
                onCancel() {
                    that.destroyAll();
                },
            });
        },
        resetForm() {
            this.edit_id = '';
            this.$nextTick(()=>{
                this.$refs.ruleForm.resetFields();
                this.fileList = [];
            })
        },
        resetForm_edit() {
            this.edit_id = '';
            this.$nextTick(()=>{
                this.$refs.ruleForm_edit.resetFields();
                this.fileList = [];
            })
        },
        onchangetime(date, dateString) {
            this.form_add.fujiantime = dateString;
        },
        beforeUpload(file) {
            if (file) {

                if (file.size > 50*1024*1024) { // 此处判断上传文件的大小 , 单位为 b 故要乘以两个1024
                    this.$message.warning('文件最大为50兆')
                    return
                } else if (file.type!='application/pdf') { // 此处判断上传文件的格式
                    this.$message.warning('请上传pdf格式的文件')
                    return
                } else {
                    this.files = file;
                    this.form_add.fujianfile = file;
                    this.fileList = [file];
                }
            }
            return false;
        },
        handleUpload(e) {
            const files = e.target.files[0];
            if (files) {
                this.files = files;
            }
        },
        handleSubmit() {
            let that = this;
            this.$refs.ruleForm.validate(valid => {
                if (valid) {
                    this.disabled_add = true;
                    // let formData = new FormData();
                    // formData.append('cxj_cxj_id', that.cxj_cxj_id);
                    // formData.append('fjWjMc', that.form.fujianname);
                    // formData.append('file', this.files);
                    // formData.append('id', '');
                    // that.getData(formData);
                    let formData = new FormData();
                    formData.append('cxj_cxj_id', that.cxj_cxj_id);
                    formData.append('file', this.files);
                    formData.append('id', '');
                    that.getData(formData);
                } else {
                    return false;
                }
            });
        },
        handleSubmit_edit() {
            let that = this;
            this.$refs.ruleForm_edit.validate(valid => {
                if (valid) {
                    this.disabled_edit = true;
                    let formData = new FormData();
                    formData.append('cxj_cxj_id', that.cxj_cxj_id);
                    // formData.append('fjWjMc', that.form_add.fujianname_edit);
                    if (this.files) {
                        formData.append('file', this.files);
                    }
                    formData.append('id', this.edit_id);
                    that.getData(formData);
                } else {
                    return false;
                }
            });
        },
        getData(formData) {
            let that = this;
            if (that.upload_type == '0') {
                formData.append('zscqMc', that.form_add.fujianname);
                formData.append('zscqLb', that.form_add.fujianleibie);
                formData.append('zscqGb', that.form_add.fujianguobie);
                formData.append('zscqSqh', that.form_add.fujianshenqing);
                formData.append('zscqSqha', that.form_add.fujianshouquan);
                cxjsb_zscqAdd(formData).then(res=>{
                    if (this.edit_id) {
                        this.handleCancel_edit();
                    } else {
                        this.handleCancel();
                    }
                    if (res.data.code=='200') {
                        that.$message.success('保存成功');
                        that.get_cxjsb_zscqList();
                    } else {
                        that.$message.error(res.data.message);
                    }
                }).catch(err=>{
                    this.disabled_add = false;
                    this.disabled_edit = false;
                })
            } else if (that.upload_type == '1') {
                formData.append('ssyyDwmc', that.form_add.fujiandanwei);
                formData.append('ssyyQssj', that.form_add.fujiantime);
                formData.append('ssyyLxr', that.form_add.fujianlianxiren);
                formData.append('ssyyDh', that.form_add.fujiandianhua);
                formData.append('ssyyJjxy', that.form_add.fujianxiaoyi);
                cxjsb_ssyyAdd_fj(formData).then(res=>{
                    if (this.edit_id) {
                        this.handleCancel_edit();
                    } else {
                        this.handleCancel();
                    }
                    if (res.data.code=='200') {
                        that.$message.success('保存成功');
                        that.get_cxjsb_ssyyList();
                    } else {
                        that.$message.error(res.data.message);
                    }
                }).catch(err=>{
                    this.disabled_add = false;
                    this.disabled_edit = false;
                })
            } else if (that.upload_type == '2') {
                formData.append('fjWjMc', that.form_add.fujianname);
                cxjsb_qtfjAdd(formData).then(res=>{
                    if (this.edit_id) {
                        this.handleCancel_edit();
                    } else {
                        this.handleCancel();
                    }
                    if (res.data.code=='200') {
                        that.$message.success('保存成功');
                        that.get_cxjsb_qtfjList();
                    } else {
                        that.$message.error(res.data.message);
                    }
                }).catch(err=>{
                    this.disabled_add = false;
                    this.disabled_edit = false;
                })
            }
        },
        destroyAll() {
            this.$destroyAll();
        },
        get_cxjsb_zscqList() {
            let that = this;
            cxjsb_zscqList({cxj_cxj_id: that.cxj_cxj_id}).then(res=>{
                if (res.data.code=='200') {
                    that.zscqlist = res.data.result;
                }
            })
        },
        get_cxjsb_ssyyList() {
            let that = this;
            cxjsb_ssyyList({cxj_cxj_id: that.cxj_cxj_id}).then(res=>{
                if (res.data.code=='200') {
                    that.ssyylist = res.data.result;
                }
            })
        },
        get_cxjsb_qtfjList() {
            let that = this;
            cxjsb_qtfjList({cxj_cxj_id: that.cxj_cxj_id}).then(res=>{
                if (res.data.code=='200') {
                    that.qtfjlist = res.data.result;
                }
            })
        },
        init() {
            this.get_cxjsb_zscqList();
            this.get_cxjsb_ssyyList();
            this.get_cxjsb_qtfjList();
        },
    },
    mounted() {
        this.cxj_cxj_id = this.$route.query.cxj_cxj_id;
        this.init();
    }
}
</script>

<style lang="less" scoped>
.list_title {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 30px;
    margin-bottom: 25px;
    .list_name {
        font-size: 16px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #3388EE;
    }
}
.shangchuan {
    width: 70px;
    height: 32px;
    line-height: 32px;
    color:#fff;
    text-align: center;
    border: 1px solid #3388EE;
    background: #3388EE;
    margin-left: 10px;
    border-radius: 4px;
    display: inline-block;
}
.tableList {
    // padding-bottom: 30px;
    table {
        margin-top: 20px;
        background: #FFFFFF;
        thead {
            background: #F5F5F5;
            tr {
                th {
                    height: 60px;
                    font-size: 16px;
                    font-family: PingFangSC-Medium, PingFang SC;
                    font-weight: 500;
                    color: #333333;
                }
            }
        }
        tbody {
            tr {
                height: 52px;
                border-bottom: 1px solid #E8E8E8;
                td {
                    color: #444444;
                    font-size: 14px;
                    font-weight: 400;
                    height: 52px;
                }
            }
        }
    }
}
</style>